<!DOCTYPE html>    
<html lang="en">    
<head>    
    <meta charset="UTF-8">  <!-- 设置文档字符编码为UTF-8 -->  
    <meta name="viewport" content="width=device-width, initial-scale=1.0">  <!-- 响应式设计的视口设置 -->  
    <title>搜索</title>  <!-- 页面标题 -->  
    <style>    
        /* 搜索容器样式 */  
        .search-container {    
            margin-top: 20px;  /* 上外边距 */  
            text-align: center;  /* 文本居中 */  
        }    
        /* 搜索输入框样式 */  
        .search-container input[type=text] {    
            padding: 10px;  /* 内边距 */  
            font-size: 17px;  /* 字体大小 */  
            border: 1px solid grey;  /* 边框 */  
            float: left;  /* 浮动到左侧 */  
            width: 80%;  /* 宽度 */  
            background: #f1f1f1;  /* 背景色 */  
        }    
        /* 搜索按钮样式 */  
        .search-container button {    
            float: left;  /* 浮动到左侧 */  
            width: 20%;  /* 宽度 */  
            padding: 10px;  /* 内边距 */  
            background: #4CAF50;  /* 背景色 */  
            color: white;  /* 字体颜色 */  
            font-size: 17px;  /* 字体大小 */  
            border: 1px solid grey;  /* 边框 */  
            border-left: none;  /* 左侧无边框 */  
            cursor: pointer;  /* 鼠标悬停时显示为手形 */  
        }    
        /* 搜索按钮点击时样式 */  
        .search-container button:hover {    
            background: #45a049;  /* 背景色变化 */  
        }    
    </style>    
    <link rel="stylesheet" type="text/css" href="1styles.css">   
</head>   
<body>    
    <!-- 搜索容器 -->  
    <div class="search-container">    
        <input type="text" id="searchInput" placeholder="搜索...">  <!-- 搜索框 -->  
        <button onclick="searchFunction()">搜索</button>  <!-- 搜索按钮 -->  
    </div>    
    <!-- 链接到其他页面（login.html）的图片 -->  
    <a href="login1.html">    
        <img src="image11.jpg" alt="点击跳转到其他页面" id="image11">    
    </a>    
    <!-- 其他图片 -->  
    <img src="image12.jpg" alt="图片描述" id="image12">   
    <img src="image13.jpg" alt="图片描述" id="image13">   
    <img src="image14.jpg" alt="图片描述" id="image14">   
</body>    
</html>